<template>
	<view class="paypage">
		<delivery-layout></delivery-layout>


		<view class="goodsList">
			<goods-list></goods-list>
		</view>
		<view class="box">

			<!-- <view class="left">备注</view> -->
			<u--textarea v-model="currentAddress.desc" placeholder="备注信息"></u--textarea>

		</view>
		<!-- #ifndef MP-WEIXIN -->
		<!-- <view class="paytype">
			<view class="box" :class="item.value == payDefValue ? 'active':''" v-for="item in payType"
				@click="clickPayBtn(item.value)">
				<u-icon :name="item.icon" :color="item.color" class="icon" size="26"></u-icon>
				<text class="font">{{item.name}}</text>
			</view>
		</view> -->
		<!-- #endif -->


		<view class="payTabbar">
			<car-layout type="pay"></car-layout>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters,
		mapMutations
	} from "vuex"
	export default {
		data() {
			return {
				// #ifdef APP-PLUS || H5
				payDefValue: "alipay",
				// #endif

				// #ifdef MP-WEIXIN
				payDefValue: 'wxpay',
				// #endif

				payType: [{
					name: "支付宝",
					value: "alipay",
					color: "#1578FF",
					icon: "zhifubao"
				}, {
					name: "微信",
					value: "wxpay",
					color: "#04C15F",
					icon: "weixin-fill"
				}],

			};
		},
		computed: {
			...mapGetters(["currentAddress"])
		},
		methods: {
			//选择支付类型
			clickPayBtn(value) {
				this.payDefValue = value
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: $page-bg-color;
	}

	.paypage {
		padding: 30rpx;

		.goodsList {
			margin-top: 30rpx;
		}

		.paytype {
			@include flex-box();

			.box {
				.u-textarea {
					background: #F7F7F7;
				}
			}

			.box:first-child.active {
				border-color: #1578FF;
				color: #1578FF;
				filter: grayscale(0%);
			}

			.box:last-child.active {
				border-color: #04C15F;
				color: #04C15F;
				filter: grayscale(0%);
			}
		}

		.payTabbar {
			position: fixed;
			width: 100%;
			bottom: 0;
			left: 0;
		}

		.body {
			background: #fff;
			padding: 25rpx;

			.box {
				padding: 40rpx 20rpx;
				background: $page-bg-color;
				border-radius: 10rpx;
				font-size: 30rpx;
				@include flex-box();

				.center {
					flex: 1;
					padding: 0 30rpx;
					font-size: 30rpx;

					.userinfo {
						padding-top: 10rpx;
					}
				}
			}
		}
	}
</style>